<div class="demo-drawer mdl-layout__drawer mdl-color--blue-grey-900 mdl-color-text--blue-grey-50">
    <header class="demo-drawer-header">
        <img src="static/images/icon.jpg" class="demo-avatar" alt="icon">
        <div class="demo-avatar-dropdown">
            <span>PagerMaid</span>
            <div class="mdl-layout-spacer"></div>
            <button id="accbtn" class="mdl-button mdl-js-button mdl-js-ripple-effect mdl-button--icon">
                <i class="material-icons" role="presentation">arrow_drop_down</i>
                <span class="visuallyhidden">Options</span>
            </button>
            <ul class="mdl-menu mdl-menu--bottom-right mdl-js-menu mdl-js-ripple-effect" for="accbtn">
                <li class="mdl-menu__item" onclick="location.href='profile';">Profile</li>
                <li class="mdl-menu__item" onclick="location.href='logout';">Logout</li>
            </ul>
        </div>
    </header>
    <nav class="demo-navigation mdl-navigation mdl-color--blue-grey-800">
        <a class="mdl-navigation__link" href="/">
            <i class="mdl-color-text--blue-grey-400 material-icons" role="presentation">home</i>Dashboard
        </a>
        <a class="mdl-navigation__link" href="settings">
            <i class="mdl-color-text--blue-grey-400 material-icons" role="presentation">settings</i>
            Settings
        </a>
        <a class="mdl-navigation__link" href="logout">
            <i class="mdl-color-text--blue-grey-400 material-icons" role="presentation">logout</i>
            Logout
        </a>

        <div class="mdl-layout-spacer"></div>
        <a class="mdl-navigation__link" href="https://xtaolabs.com/" target="_blank">
            <i class="mdl-color-text--blue-grey-400 material-icons" role="presentation">help_outline</i>
            <span class="visuallyhidden">Help</span>
        </a>
    </nav>
</div>